<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>用户</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no"/>
    <meta name="renderer" content="webkit"/>
    <meta name="force-rendering" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <link rel="stylesheet" href="/static/public/libs/layui-v2.5.6/layui/css/layui.css">
    <link href="/static/public/libs/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
    <link href="/static/admin/static/css/main.css" rel="stylesheet"/>
    <link href="/static/admin/pages/settings/css/setting.css" rel="stylesheet"/>
</head>
<body class="layui-layout-body">
<div class="p-container">
    <div class="layui-card">
        <div class="layui-card-body">
            <div class="layui-tab layui-tab-brief" lay-filter="settingTab">
                <ul class="layui-tab-title">
                    <li class="layui-this" lay-id="1">基础设置</li>
                    <li lay-id="2">邮箱服务</li>
                    <li lay-id="3">系统更新</li>
                </ul>
                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">
                        <form class="layui-form" action="">
                            <div class="layui-input-inline"  style="display: none;">
                                <select lay-verify="" type="hidden"></select>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">网站名称</label>
                                <div class="layui-input-block">
                                    <input type="text" value="#option('WEB_NAME')" name="WEB_NAME" placeholder="请输入网站名称" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">网站ICO</label>
                                <div class="layui-input-block">
                                    <div class="p-upload-box" id="WEB_LOGO">
                                            <input type="hidden" value="#option('WEB_LOGO')" name="WEB_LOGO" value="">
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">网站域名</label>
                                <div class="layui-input-block">
                                        <input type="text" value="#option('WEB_SITE')" name="WEB_SITE" value="" placeholder="请输入网站域名,如http://yinpengfei.com" autocomplete="off" class="layui-input">
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">网站标题</label>
                                <div class="layui-input-block">
                                    <input type="text" value="#option('WEB_TITLE')" name="WEB_TITLE" placeholder="请输入网站标题" autocomplete="off" class="layui-input">
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">评论需审核</label>
                                <div class="layui-input-block">
                                    <input type="radio" name="WEB_COMMENT_IS_REVIEW" value="1" title="开启" #(optionCompare('WEB_COMMENT_IS_REVIEW', '1') ? 'checked': '')>
                                    <input type="radio" name="WEB_COMMENT_IS_REVIEW" value="0" title="关闭" #(optionCompare('WEB_COMMENT_IS_REVIEW', '0') ? 'checked': '')>
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">允许注册新用户</label>
                                <div class="layui-input-block">
                                    <input type="radio" name="WEB_IS_REGISTER" value="1" title="允许" #(optionCompare('WEB_IS_REGISTER', '1') ? 'checked': '')>
                                    <input type="radio" name="WEB_IS_REGISTER" value="0" title="不允许" #(optionCompare('WEB_IS_REGISTER', '0') ? 'checked': '')>
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">新用户默认角色</label>
                                <div class="layui-input-block" style="margin-left: 130px;width: 200px">
                                    <select name="WEB_REGISTER_DEFAULT_ROLE">
                                        <option value="user" #(optionCompare('WEB_REGISTER_DEFAULT_ROLE', 'user') ? 'selected': '')>普通用户</option>
                                        <option value="contribute" #(optionCompare('WEB_REGISTER_DEFAULT_ROLE', 'contribute') ? 'selected': '')>文章贡献</option>
                                        <option value="editor" #(optionCompare('WEB_REGISTER_DEFAULT_ROLE', 'editor') ? 'selected': '')>文章编辑</option>
                                        <option value="admin" #(optionCompare('WEB_REGISTER_DEFAULT_ROLE', 'amin') ? 'selected': '')>管理员</option>
                                    </select>
                                </div>

                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">META关键字</label>
                                <div class="layui-input-block">
                                    <textarea name="WEB_META_KEYWORD" placeholder="请输入META关键字,英文逗号分割" class="layui-textarea">#option('WEB_META_KEYWORD')</textarea>
                                </div>
                            </div>


                            <div class="layui-form-item">
                                <label class="layui-form-label">META描述</label>
                                <div class="layui-input-block">
                                    <textarea name="WEB_META_DESC" placeholder="请输入META描述" class="layui-textarea">#option('WEB_META_DESC')</textarea>
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">版权信息</label>
                                <div class="layui-input-block">
                                    <textarea name="WEB_COPYRIGHT" placeholder="请输入版权信息" class="layui-textarea">#option('WEB_COPYRIGHT')</textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <button class="layui-btn addBtn" lay-submit lay-filter="optionForm">保存设置</button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="layui-tab-item">
                        <form class="layui-form" action="">
                            <div class="layui-input-inline"  style="display: none;">
                                <select lay-verify="" type="hidden"></select>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">SMTP服务</label>
                                <div class="layui-input-block">
                                    <input type="text" value="#option('SMTP_SERVER')" name="SMTP_SERVER" placeholder="请输入SMTP服务器,如smtp.126.com" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">邮箱账户</label>
                                <div class="layui-input-block">
                                    <input type="text" value="#option('SMTP_EMAIL')" name="SMTP_EMAIL" placeholder="请输入邮箱账户" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">授权码</label>
                                <div class="layui-input-block">
                                    <input type="text" value="#option('SMTP_AUTH')" name="SMTP_AUTH" placeholder="请输入授权码" autocomplete="off" class="layui-input">
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">端口</label>
                                <div class="layui-input-block">
                                    <input type="text" value="#option('SMTP_PORT')" name="SMTP_PORT" placeholder="请输入服务端口" autocomplete="off" class="layui-input">
                                    <p style="color: #4D4D4D">如465,设置完后请同时把服务器对应的端口权限放开,非必要不建议设置25端口,如果是阿里云服务器需要用25端口的话,需要去阿里云申请解封端口</p>
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">评论是否邮件通知</label>
                                <div class="layui-input-block">
                                    <input type="radio" name="COMMENT_IS_SEND_MAIL" value="1" title="通知" #(optionCompare('COMMENT_IS_SEND_MAIL', '1') ? 'checked': '')>
                                    <input type="radio" name="COMMENT_IS_SEND_MAIL" value="0" title="不通知" #(optionCompare('COMMENT_IS_SEND_MAIL', '0') ? 'checked': '')>
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <button class="layui-btn addBtn" lay-submit lay-filter="optionForm2" >保存设置</button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="layui-tab-item">
                        <div class="update-content">
                            <div style="font-size: 15px;color: #4a9fff;">
                                检测到新版本
                            </div>
                            <div>
                                <span class="updateLabel">版本:</span>
                                <span id="updateVersion"></span>
                            </div>
                            <div>
                                <span class="updateLabel">文件大小:</span>
                                <span id="updateSize"></span>
                            </div>
                            <div>
                                <span class="updateLabel">更新内容:</span><br>
                                <span id="updateContent"></span>
                            </div>
                            <button class="layui-btn addBtn" id="update">开始更新</button>
                            <p style="color: red">注意事项: 更新时系统会自动备份当前版本程序到配置的备份目录下(默认在项目目录的backup文件夹),更新时会短暂的停止服务,请不要关闭此页面,如出现更新失败问题,请手动恢复备份程序</p>
                        </div>
                        <div class="update-console">

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="/static/public/libs/jquery/jquery-3.5.1.min.js"></script>
<script src="/static/public/libs/layui-v2.5.6/layui/layui.all.js"></script>
<script src="/static/public/js/main.js"></script>
<script src="/static/public/js/reconnecting-websocket.min.js"></script>
<script>
    let layer,form,element;
    var ws = null;
    layui.use(['layer','form','element'], function() {
        layer = layui.layer;
        form = layui.form;
        element = layui.element;
        form.on('submit(optionForm2)', function(data){
            save(data);
            return false;
        });
        form.on('submit(optionForm)', function(data){
            save(data);
            return false;
        });

        element.on('tab(settingTab)', function(){
            if (this.getAttribute('lay-id') === "3") {
                let loadIndex = layer.load("正在检查更新...");
                $.get("/checkUpdate",function(data){
                    layer.close(loadIndex);
                    if (data.code === 200) {
                        $("#updateTitle").text(data.data.name);
                        $("#updateVersion").text(data.data.tagName);
                        $("#updateContent").html(data.data.body.replaceAll("\r\n","<br>"));
                        $("#updateSize").text(data.data.sizeString);
                    } else if (data.code === 500) {
                        console.log("检查更新出错");
                        $(".update-content").html("检查更新出错,请重试");
                    } else {
                        $(".update-content").html("暂无更新");
                    }
                    $(".update-content").show();
                    startWebsocket();
                });
            }
        });



        $(".update-content").on('click', '#update', function () {
            layer.confirm('是否确认更新?', {title: '提示'}, function (index) {
                layer.close(index);
                $("#update").hide();
                startUpdate();
            });
        });

        function startUpdate() {
            $(".update-console").show();
            $.get("/update",function(data){});
        }

        function startWebsocket() {
            if (ws != null) {
                ws.close();
            }
            var flag = false;
            var tipFlag = false;
            var url = 'ws://'+window.location.host+'/websocket';
            if ('https:' === document.location.protocol) {
                url = 'wss://'+window.location.host+'/websocket';
            }

            ws = new ReconnectingWebSocket(url);
            ws.onopen = function (e) {
                if (!flag) {
                    $("#update").show();
                }
                flag = true;
                console.log("Connection open ...");
                const msg = {type: 1};
                ws.send(JSON.stringify(msg));
            };
            ws.onmessage = function (e) {
                let dataJson = JSON.parse(e.data);
                let classStr = "";
                if(dataJson.data === 2) {
                    classStr = "updateError";
                }
                $(".update-console").append("<p class='"+classStr+"'>"+dataJson.message +"</p>");
                if ($(".update-console").children().length > 100) {
                    $(".update-console").children().first().remove();
                }
                $(".update-console").scrollTop($(".update-console")[0].scrollHeight);
            };
            ws.onclose = function (e) {
            };
            ws.onerror =function (e) {
                if (!flag && !tipFlag) {
                    tipFlag = true;
                    layer.confirm('检测到您的Nginx或其他容器配置未开启websocket支持,请参考官方文档->文档->常见问题6进行开启', {title: '提示'}, function (index) {
                        layer.close(index);
                    });
                }
            };
        }
    });

    function save(data) {
        $.ajax({
            type: "POST",
            url: "/admin/setting/save",
            contentType:"application/json",
            data: JSON.stringify(data.field),
            success:function(d){
                if (d.code === 200){
                    parent.layer.msg("保存成功", {icon: 1})
                } else {
                    layer.msg(d.msg, {icon: 2});
                }
            },
            error: function (data) {
                layer.msg("保存失败", {icon: 2});
            }
        });
    }
</script>
</body>
</html>